<template><!--提币管理-->
    <div class="allBox">
        <div class="webPageTitle">提币管理</div>
        <div class="leftTitle">
            <div class="dataTitle">提币列表</div>
            <div style="float: right;" class="myFromBox">
                <Button slot="append" icon="ios-search" @click="selectData(1)"></Button>
            </div>
            <div style="float: right;" class="myFromBox">
                <Input v-model="coinType" placeholder="请输入币种"/>
            </div>
        </div>

        <div style="float: left;width: 100%;">
            <Table highlight-row :loading="loading" :columns="tableColumns" :data="tableData"></Table>
        </div>
        <div class="pageBox">
            <Page :total="total" :page-size="rows" show-total @on-change="selectList" class="pageStyle"></Page>
        </div>
        <!--读取API错误-->
        <div style="z-index: 10000">
            <Modal v-model="redAPIModal" width="360" id="iviw-modal">
                <p slot="header" style="color:#f60;text-align:left">
                    <Icon type="information-circled"></Icon>
                    <span>{{redAPIModalTit}}</span>
                </p>
                <div style="text-align: center">
                    <p>错误信息：{{redAPIModalCen}}</p>
                    <p></p>
                </div>
                <div slot="footer">
                    <Button type="error" size="large" long @click="redAPIModalFun">确定</Button>
                </div>
            </Modal>

        </div>
    </div>
</template>

<script>
    export default {
        data() {
            return {
                tableColumns: [
                    {title: 'ID', key: 'id', align: 'center'},
                    {title: '用户名', key: 'userName', align: 'center'},
                    {title: '币种', key: 'coinType', align: 'center'},
                    {title: '提现地址', key: 'address', align: 'center', width: 250},
                    {title: '提币数量', key: 'value', align: 'center'},
                    {title: '提币手续费', key: 'fee', align: 'center'},
                    {
                        title: '状态', align: 'center',
                        render: (h, params) => {
                            return h('div', [
                                h('div', {
                                    style: {
                                        "color": params.row.status == 0 ? 'gray' : params.row.status == 1 ? 'green' : 'red',
                                        'font-size': 'initial'
                                    },
                                }, params.row.statusString),
                            ]);
                        }
                    },
                    {title: '备注', key: 'remark', align: 'center'},
                    {title: '创建时间', key: 'createTm', align: 'center', width: 180},
                    {
                        title: '操作',
                        key: 'action',
                        width: 300,
                        align: 'center',
                        render: (h, params) => {
                            return h('div', [
                                h('Button', {
                                    props: {
                                        type: 'error',
                                        size: 'small'
                                    },
                                    style: {
                                        marginRight: '5px',
                                    },
                                    attrs: {
                                        disabled: params.row.status > 0 ? true : false
                                    },
                                    on: {
                                        click: () => {
                                            this.gepassword(params.row.id, 1)
                                        }
                                    }
                                }, '通过'),
                                h('Button', {
                                    props: {
                                        type: 'error',
                                        size: 'small'
                                    },
                                    style: {
                                        marginRight: '5px'
                                    },
                                    attrs: {
                                        disabled: params.row.status > 0 ? true : false
                                    },
                                    on: {
                                        click: () => {
                                            this.auditWithdraw(params.row.id, 3)
                                        }
                                    }
                                }, '驳回'),
                            ]);
                        }
                    }],
                tableData: [],
                redAPIModal: false,
                redAPIModalTit: '',
                redAPIModalCen: '',
                rows: 0,
                showPage: '',
                loading: true,                                              //表单数据加载时
                total: 0,
                coinType: '',
                password: '',
                id: '',
                status: ''
            }
        },
        methods: {

            /**
             * 读取新闻列表
             *
             *
             * */
            selectList: function (page) {
                let _self = this;
                _self.showPage = page;
                _self.$http.get(_self.service + '/coin/userCoinRecord', {
                    params: {
                        index: page,
                        rows: _self.rows,
                        coinType: _self.coinType,
                        opType: 2
                    }
                }).then(function (res) {
                    if (res.data.code == '001') {
                        let datas = res.data.result.data;
                        for (let i in datas) {
                            let dateTM = new Date(datas[i].createTm);
                            let tiem = _self.formatDate(dateTM, 'yyyy-MM-dd hh:mm:ss');
                            datas[i].createTm = tiem;
                            let status = datas[i].status;
                            if (status == 0) {
                                status = '未审核';
                            } else if (status == 1) {
                                status = "提币成功";
                            } else if (status == 2) {
                                status = '提币失败';
                            } else if (status == 3) {
                                status = "提币驳回";
                            }
                            datas[i].statusString = status;
                        }
                        _self.tableData = datas;
                        _self.loading = false;
                        _self.total = res.data.result.total
                    } else {
                        _self.modalFun('读取提币信息', res.data.msg)
                    }
                })
            },

            /**
             * 输入密码
             *
             * @param {integer} id   id
             *
             * */
            gepassword: function (id, status) {
                this.id = id
                this.status = status
                this.$Modal.confirm({
                    render: (h) => {
                        return h('Input', {
                            props: {
                                value: this.value,
                                autofocus: true,
                                type:'password',
                                placeholder: '请输入密码'
                            },
                            on: {
                                input: (val) => {
                                    this.password = val;
                                }
                            }
                        })
                    },
                    onOk: () => {
                        let _self = this;
                        _self.passwordsh()

                    },
                })
            },
            // pass审核
            passwordsh: function () {
                var _self = this;
                _self.$http.post(_self.service + '/coin/validation', {
                    id: _self.id,
                    status: _self.status,
                    password: _self.password
                }).then(function (res) {
                    console.log(res.data.code);
                    if (res.data.code == '001') {
                        _self.auditWithdraw(_self.id,_self.status)
                    } else {
                        _self.modalFun('操作失败', '密码错误')
                    }
                })
            },
            /**
             * 删除图片
             *
             * @param {integer} id   id
             *
             * */
            auditWithdraw: function (id,status) {
                var _self = this;
                _self.$http.post(_self.service + '/coin/auditCoinWithdraw', {
                    id: id,
                    status: status
                }).then(function (res) {
                    console.log(res.data.code);
                    if (res.data.code == '001') {
                        _self.$Message.success('操作成功！')
                    } else if (res.data.code == '071') {
                        _self.$Message.success('用户钱包资金还在归集中，请稍后再试！')
                    } else {
                        _self.modalFun('操作失败', res.data.msg)
                    }
                    _self.selectList(_self.showPage);
                })
            },

            /**
             * 报错提示信息
             *
             * @param {string} modTit  定义错误标题
             * @param {string} modCen  定义错误内容
             *
             * @return {null}  null
             * */
            modalFun: function (modTit, modCen) {
                this.redAPIModal = true;
                this.redAPIModalTit = modTit;
                this.redAPIModalCen = modCen;
            },
            redAPIModalFun: function () {
                this.redAPIModal = false
            },

            /**
             *获取浏览器高度对 table的 row 显示进行数量控制
             * */
            tableRowH: function () {
                let _self = this;
                let winHeight = document.documentElement.clientHeight;
                _self.rows = Math.floor((winHeight - (40 + 50 + 50 + 100)) / 48) - 1;
            }
        },
        created: function () {
            this.tableRowH();
            this.selectList(1)
        }


    }
</script>
<style scoped>
    .pageBox {
        float: left;
        width: 100%;
        margin-top: 10px
    }

    .pageStyle {
        float: right;
        margin-right: 20px;
        margin-bottom: 10px;
    }

    .imgBoxImg {
        position: relative;
        width: 100%;
        height: 180px;
        border: 1px dashed #999;
        border-radius: 5px;
    }

    .imgBoxImg:hover {
        border: 1px dashed green;
        border-radius: 5px;

    }

    .imgBoxImg img {
        width: 100%;
        height: 100%;
    }

    .uploadBox {
        width: 100%;
        height: 100%;
        position: absolute;
        overflow: hidden;
        filter: alpha(opacity=0);
        -moz-opacity: 0;
        opacity: 0;
        z-index: 1000;
    }
</style>
